<template>
  <div class="AAH_module">
    <module-header
      :title="title"
      :meter="meter"
      :params="{
        module: 'AAG',
        status,
        Id: '',
        Bore: '',
        Cutting: ''
      }"
    />
    <section>
      <task-tab class="module-content" :settings="module_settings" />
    </section>
    <section class="settings">
      <el-tabs v-model="activeName">
        <el-tab-pane label="1、2、3、4信号参数" name="firstName">
          <el-table :data="pressureData" border stripe size="mini">
            <el-table-column prop="holesite" label="孔位"></el-table-column>
            <el-table-column prop="mV" label="前置mV"></el-table-column>
            <el-table-column prop="amplitude" label="目标幅度"></el-table-column>
            <el-table-column prop="saturability" label="饱和度"></el-table-column>
            <el-table-column prop="pregain" label="前置增益"></el-table-column>
            <el-table-column prop="us" label="声延时μs"></el-table-column>
          </el-table>
          <div class="sub-table">
            <el-table :data="channelData" border stripe size="mini">
              <el-table-column prop="channel" label="声道"></el-table-column>
              <el-table-column prop="velocity" label="声速m/s"></el-table-column>
              <el-table-column prop="offset" label="偏移量"></el-table-column>
            </el-table>
          </div>
        </el-tab-pane>
        <el-tab-pane label="5、6、7、8信号调试" name="secondName"></el-tab-pane>
        <el-tab-pane label="截图" name="thirdName"></el-tab-pane>
      </el-tabs>
    </section>
    <section class="table">
      <record-table
        title="调试记录表"
        procedure="AAH"
        :meter="meter"
        :limits="RecordTableLimit"
        :params="{
          title,
          Cutting: ''
        }"
        :tableData="tableData"
        :tableColumnDict="tableColumnDict"
      />
    </section>
  </div>
</template>

<script lang="ts">
import Vue from 'vue'
import { Component, Prop } from 'vue-property-decorator'
import { tableColumnDict, TableColumnType, module_settings } from './params'
import ModuleHeader from '@/components/basic/ModuleHeader.vue'
import TaskTab from '@/views/dashboard/compoents/TaskTab.vue'
import RecordTable from '@/components/basic/RecordTable.vue'
import { Dictionary, SettingType } from '@/interface/Basic'
@Component({
  components: {
    ModuleHeader,
    TaskTab,
    RecordTable
  }
})
class NoneStandard extends Vue {
  @Prop() status!: string
  @Prop({ default: '' }) meter!: string
  @Prop({ required: true }) title!: string
  activeName: string = 'firstName'
  pressureData = [
    {
      holesite: '1A',
      mV: '',
      amplitude: '',
      saturability: '',
      pregain: '',
      us: ''
    },
    {
      holesite: '1B',
      mV: '',
      amplitude: '',
      saturability: '',
      pregain: '',
      us: ''
    },
    {
      holesite: '2A',
      mV: '',
      amplitude: '',
      saturability: '',
      pregain: '',
      us: ''
    },
    {
      holesite: '2B',
      mV: '',
      amplitude: '',
      saturability: '',
      pregain: '',
      us: ''
    },
    {
      holesite: '3A',
      mV: '',
      amplitude: '',
      saturability: '',
      pregain: '',
      us: ''
    },
    {
      holesite: '3B',
      mV: '',
      amplitude: '',
      saturability: '',
      pregain: '',
      us: ''
    },
    {
      holesite: '4A',
      mV: '',
      amplitude: '',
      saturability: '',
      pregain: '',
      us: ''
    },
    {
      holesite: '4B',
      mV: '',
      amplitude: '',
      saturability: '',
      pregain: '',
      us: ''
    }
  ]
  channelData = [
    {
      channel: '声道1',
      velocity: '',
      offset: ''
    },
    {
      channel: '声道2',
      velocity: '',
      offset: ''
    },
    {
      channel: '声道3',
      velocity: '',
      offset: ''
    },
    {
      channel: '声道4',
      velocity: '',
      offset: ''
    }
  ]
  tableData: TableColumnType[] = []
  tableColumnDict = tableColumnDict
  module_settings: SettingType[] = module_settings
  init_button_limit: Dictionary<boolean> = {
    // 保存
    AAG_0: true,
    // 删除
    AAG_1: true,
    // 新建
    AAG_2: true,
    // 读取三坐标
    AAG_3: true,
    // 手动选择三坐标
    AAG_4: true
  }
  get RecordTableLimit(): Dictionary<boolean> {
    const { AAG_0, AAG_1, AAG_2 } = this.init_button_limit
    return {
      Store: AAG_0,
      Create: AAG_2,
      Delete: AAG_1
    }
  }
}
export default NoneStandard
</script>

<style lang="less" scoped>
@import '~@/styles/theme.less';
@import '~@/styles/layout.less';
.AAH_module {
  box-sizing: border-box;
  padding: 20px;
  width: 100%;
  height: 100%;
  #flex(column, flex-start, flex-start);
  header {
    width: 100%;
    margin-bottom: 10px;
    #flex(row, center, space-between);
    h4 {
      margin-block: 0;
      font-size: 18px;
      font-weight: 800;
      white-space: nowrap;
      #color(color, --primary-text-color);
    }
    .AAL001 {
      #flex(row, center, space-between);
      span {
        font-size: 14px;
        font-weight: 400;
        margin-right: 5px;
        white-space: nowrap;
        #color(color, --primary-text-color);
      }
    }
  }
  section {
    box-sizing: border-box;
    padding: 10px;
    width: 100%;
    margin-bottom: 20px;
    border-radius: 5px;
    #color(background-color, --module-bg-color);
    #shadow-color(0, 2px, 12px, 0, --primary-shadow-color);
  }
  .settings {
    flex: 1;
    /deep/.el-tabs {
      .el-tabs__content {
        width: 100%;
        .el-tab-pane {
          width: 100%;
          #flex(row, flex-start, space-between);
        }
      }
    }
  }
  .table {
    flex: 1;
    margin-bottom: 0;
    min-height: 200px;
    overflow: auto;
  }
}
</style>
